<script setup>
import {ref,onMounted,onBeforeUnmount} from "vue"
import { useRoute } from "vue-router"
import {router} from "../../router"

import axios from "axios"
import animeModel1 from "../../components/animeModel1.vue"
import animeModel2 from "../../components/animeModel2.vue"

//值传递
const route = useRoute()

//生命周期
onMounted(()=>{
    console.log(route.params)
    document.title = "孤独摇滚 - 番剧|EvenSO"
    
})
onBeforeUnmount(()=>{
    
})

const gdygVideoUrl = ref("")
const fan_name = ref("")
const fan_fm = ref("")

const fan1Url = ref("")
const fan2Url = ref("")
const fan3Url = ref("")
const fan4Url = ref("")
const fan5Url = ref("")
const fan6Url = ref("")
const fan7Url = ref("")
const fan8Url = ref("")
const fan9Url = ref("")
const fan10Url = ref("")
const fan11Url = ref("")
const fan12Url = ref("")

axios.get("/go1-api/anime/gdyg").then(async res=>{
    // console.log(res.data[0])
    // if(route.params.fan){}
    gdygVideoUrl.value = await res.data[0].anime_msg[route.params.fan - 1].fan_player
    fan1Url.value = await res.data[0].anime_msg[0].fan_player
    fan2Url.value = await res.data[0].anime_msg[1].fan_player
    fan3Url.value = await res.data[0].anime_msg[2].fan_player
    fan4Url.value = await res.data[0].anime_msg[3].fan_player
    fan5Url.value = await res.data[0].anime_msg[4].fan_player
    fan6Url.value = await res.data[0].anime_msg[5].fan_player
    fan7Url.value = await res.data[0].anime_msg[6].fan_player
    fan8Url.value = await res.data[0].anime_msg[7].fan_player
    fan9Url.value = await res.data[0].anime_msg[8].fan_player
    fan10Url.value = await res.data[0].anime_msg[9].fan_player
    fan11Url.value = await res.data[0].anime_msg[10].fan_player
    fan12Url.value = await res.data[0].anime_msg[11].fan_player
    
    fan_name.value = await res.data[0].name
    fan_fm.value = await res.data[0]. anime_image
}).catch(err=>console.log(err))

</script>

<template>
    <div class="gdygVideoAll">
        <div class="dialogBoxColor"></div>
        <div class="gdygVideoMasterBox">
            <animeModel1 
                fan_fm=""
                :videoUrl="gdygVideoUrl"

                :fan1Url="fan1Url"
                :fan2Url="fan2Url"
                :fan3Url="fan3Url"
                :fan4Url="fan4Url"
                :fan5Url="fan5Url"
                :fan6Url="fan6Url"
                :fan7Url="fan7Url"
                :fan8Url="fan8Url"
                :fan9Url="fan9Url"
                :fan10Url="fan10Url"
                :fan11Url="fan11Url"
                :fan12Url="fan12Url"

                fanName="gdyg"
            />
        </div>
        <div class="animeMsg">
            <animeModel2 
            :fan_fm="fan_fm"
            :fan_name="fan_name"
            fan_type="漫画改"
            fan_theme1="音乐"
            fan_theme2="日常"
            fan_status="已完结 . 全12话"
            fan_year="2022"
            fan_msg="gdyg"/>
        </div>
    </div>
</template>

<style scoped>
.gdygVideoAll{
    position: absolute;
    left: 0;
    top: 0;
    width: 1855px;
    height: 100%;
    /* background-color: red; */
    /* overflow: hidden; */
}
.dialogBoxColor{
    width: 100%;
    height: 6%;
    background: linear-gradient(to right,rgba(0,255,255,1),rgba(255,255,0,1));
}
.gdygVideoMasterBox{
    width: 100%;
    height: 94%;
    /* background-color: red; */
}
.animeMsg{
    width: 100%;
    height: 80%;
    /* background-color: red; */
}
</style>